document.addEventListener("DOMContentLoaded", function(event) {
  var btn = document.getElementById('btn_sort');
  btn.addEventListener('click', function() {
		getHtml();
  }, false);
}, false);

function sortIsShow(index) {
  var sort = document.getElementById('sort_index'),
    is;
  setTimeout(function() {
    is = sort.classList.contains('sort_leave');
    if (is) {
      sort.classList.remove('sort_leave');
      sort.classList.add('sort_active');
      document.body.style.overflow = 'hidden';
      sort.previousSibling.style.display = 'block'
    } else {
      sort.classList.add('sort_leave');
      sort.classList.remove('sort_active');
      document.body.style.overflow = '';
      sort.previousSibling.style.display = 'none'
    }
  }, 0);
};
function getHtml() {
	var HTML='';
	$.ajax({
		  url:"getClassificationList",
		  type:"post",
		  dataType:"json",
		  success : function(data, textStatus) {
			  var state = data.result.state;
			  HTML += '<div class="sort_list"><ul>';
			  if(state == 1){
				  $.each(data.rClassificationList,function(i,v){
					  HTML += '<li class="sort_item"><a  href="goods?parentid='+v.classifyid+'&classifyname='+v.classifyname+'"><i class="'+v.ico_img+'"></i><span>'+ v.classifyname +'</span></a></li>';
				  });
			  }
			  HTML += '</ul></div>';
			  sort(HTML);
			  sortIsShow();
		   }
	  });
}
function sort(HTML,callback) {
  var sort = document.getElementById('sort_index');
  if (!sort) {
    var nDiv = document.createElement('div');
    var nDivTwo = nDiv.cloneNode()
    nDiv.id = 'sort_index';
    nDiv.className = 'sort sort_leave';
    nDiv.innerHTML =  HTML;
    nDivTwo.className = 'sort_layer';
    document.body.appendChild(nDivTwo);
    document.body.appendChild(nDiv);
    sort = document.getElementById('sort_index');
  };
  (callback && typeof(callback) === "function") && callback(sort);
  var list = sort.querySelector('.sort_list'),
    item = list.querySelectorAll('.sort_item');
  sort.addEventListener('click', function() {
	sort.previousSibling.style.display = 'none'
    sort.classList.add('sort_leave');
    sort.classList.remove('sort_active');
    document.body.style.overflow = ''
  }, false);
  list.addEventListener('click', function(ev) {
    // ev.preventDefault();
    ev.stopPropagation();
  }, false);
  [].forEach.call(item, function(ele, index, arr) {
    ele.addEventListener('touchstart', function() {
      this.classList.add('sort_item_active');
    }, false);
    ele.addEventListener('touchend', function() {
      this.classList.remove('sort_item_active');
    }, false);
    ele.addEventListener('touchcancel', function() {
      this.classList.remove('sort_item_active');
    }, false);

  });
};
